<template>
    <div>
        <!-- 轮播图 -->
        <Container></Container>
        <!-- 推荐内容 -->
        <Recommend :recommendList="oneRecommendList"></Recommend>
        <!-- 热门商品 -->
        <HotGoods></HotGoods>
        <!-- 循环楼层 -->
        <Floor v-for="(floor,index) in floorGoodsList" :key="index" :floor="floor"></Floor>
        <!-- 第二个推荐内容 -->
        <Recommend :recommendList="twoRecommendList"></Recommend>
    </div>
</template>

<script>
import Container from "./Container/Container.vue";
import Recommend from './Recommend/Recommend.vue'
import HotGoods from './HotGoods/HotGoods.vue'
import Floor from "./Floor/Floor.vue";
import { mapGetters } from 'vuex';

// 引入ajax
export default {
    name: "Home",
    components: {
        Container,
        Recommend,
        HotGoods,
        Floor
    },
    computed:{
        ...mapGetters('home',['floorGoodsList','oneRecommendList','twoRecommendList'])
    },
    mounted(){ 
        this.$store.dispatch('home/getHomeListData')
    }
};
</script>

<style lang="less" >
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    z-index: 0;
}
</style>